define(function(require,exports,module){
    'use strict';

	var React = require('react');
	var $ = require('jquery');
	var XDate = require('xdate');
    var moment = require('moment');
	var xdate = new XDate();
	var jPages = require('jPages');
    var fancybox = require('fancybox');
	
	var publicObj = require('lib/public');

    //Pager
    var Pager = require('components/partial/Pager');
	
	module.exports = React.createClass({
        listData:function(p){
            var token = publicObj.get_token();

            var t_now_date = Math.round(new XDate(new XDate().toString("yyyy-MM-dd") +" 00:00:00").getTime() / 1000);
            var t_tomorrow_date = Math.round(new XDate(new XDate().addDays(1).toString("yyyy-MM-dd")+" 00:00:00").getTime() / 1000);

            p = parseInt(p);
            var page = p - 1;
            page = page > 0 ? page : 0;
            var pagesize = 10;
            var limit = " limit "+(page * pagesize)+","+pagesize+" ";


            var data = new Object();
            data.sql = "select headimg,ctime as date,email,gender,mobilephone as mobile,nick,username,referrer from qeeniao.user where (ctime >= " + t_now_date + " and ctime < " + t_tomorrow_date + ") order by ctime DESC "+limit;
            data.access_token = token;

            $.ajax({
                url:this.props.url,
                data:data,
                type:'post',
                dataType:'json',
                success:function(o){
                    if(this.isMounted()){
                        this.setState({'data':o});

                        if(o.length < pagesize){
                            this.setState({'next_stop':true});
                        }else{
                            this.setState({'next_stop':false});
                        }

                        if((p-1) <= 0){
                            this.setState({'pre_stop':true});
                        }else{
                            this.setState({'pre_stop':false});
                        }

                        this.setState({page:p});
                    }

                }.bind(this),
                error:function(xhr,status,err){
                    console.error('获取数据失败!',status,err.toString());
                }.bind(this)
            })
        },
		getInitialState:function(){
			return {
				data:[],
				data_sum:0,
                page:1,
                pages:0,
                pre_stop:true,
                next_stop:false
			};

		},
        loadRegisterDataSum:function(){
            var token = publicObj.get_token();
            var t_now_date = Math.round(new XDate(new XDate().toString("yyyy-MM-dd") +" 00:00:00").getTime() / 1000);
            var t_tomorrow_date = Math.round(new XDate(new XDate().addDays(1).toString("yyyy-MM-dd")+" 00:00:00").getTime() / 1000);
            var data = new Object();
            data.sql = "select count(*) as sum from qeeniao.user where (ctime >= " + t_now_date + " and ctime < " + t_tomorrow_date + ")";
            data.access_token = token;

            $.ajax({
                url:this.props.url,
                data:data,
                type:'post',
                dataType:'json',
                success:function(o){
                    if(this.isMounted()) {
                        this.setState({'data_sum': o[0].sum});
                    }

                }.bind(this),
                error:function(xhr,status,err){
                    console.error('获取数据失败!',status,err.toString());
                }.bind(this)
            })
        },
		componentDidMount:function(){
            this.loadRegisterDataSum();
            this.listData(1);
            $('.fancybox').fancybox({
                image    : '<img class="fancybox-image" src="{href}" alt="" />'
            });
        },
		componentDidUpdate:function(){

        },
		render:function(){
			var data_list = this.state.data.map(function(k){
                var headimg;
                var date = moment(parseInt(k.date) * 1000).format('YYYY-MM-DD HH:mm:ss');
                
                if(k.headimg){
                    headimg = "http://7u2r0u.com1.z0.glb.clouddn.com/" + k.headimg;
                }else{
                    headimg = "images/default.png";
                }

                var imgLoadError = function(e){
                    e.target.src = 'images/default.png';
                }

                var username = k.nick ? k.nick : k.username;

				return (
					<tr>
                        <td>
                            <a data-fancybox-type="image" href={headimg} className="fancybox" >
                                <img src={headimg} onError={imgLoadError} className="img-circle" style={{'width':'32px','height':'32px'}}/>
                            </a>
                        </td>
                        <td>{username}</td>
						<td>{k.email}</td>
						<td>{date}</td>
					</tr>
                );
			});

            var pager_props = {
                page : this.state.page,
                pre_stop:this.state.pre_stop,
                next_stop:this.state.next_stop,
                listData : this.listData
            };

			return (
				<div className="panel panel-default">
					<div className="panel-heading">
						<h3 className="panel-title">{this.props.title} :<span className="red">{this.state.data_sum}个</span></h3>
					</div>
					<div className="panel-body">
						<table className="table table-striped table-bordered table-hover">
							<thead>
								<tr>
                                    <th>头像</th>
									<th>用户名</th>
									<th>邮箱</th>
									<th>注册时间</th>
								</tr>
							</thead>
							<tbody id="itemContainer">
								{data_list}
							</tbody>
						</table>
					</div>
					<div className="panel-body">
						<Pager {...pager_props}/>
					</div>
				</div>
            );
		}
	});

});